<template>
  <div class="block">
    <span>选择的推送时间:</span>
    <div>
      <el-tag
        style="margin-right: 8px"
        v-for="(t, index) in newD"
        :key="index"
        type="info"
        closable
        @close="handleClose(t)"
        >{{ t }}</el-tag
      >
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dateArr: [],
      newD: [],
    }
  },
  props: {
    value: {
      type: Array,
      default() {
        return []
      },
    },
  },
  watch: {
    value: {
      handler(newVal) {
        this.newDate(newVal)
      },
      deep: true,
    },
    dateArr(newVal) {
      this.$emit('input', newVal)
    },
  },
  methods: {
    newDate(newVal) {
      const date = newVal.map(item => this.$formatTime(this.$dayjs(item).unix()))
      this.newD = [...new Set(date)]

      this.dateArr = newVal
    },
    handleClose(tag) {
      this.dateArr.splice(this.dateArr.indexOf(tag), 1)
    },
  },
}
</script>

<style></style>
